<template>
  <div class="aside-menu">
    <!--<el-sub-menu :index="subIndex">-->
      <!--<template #title>-->
        <!--<span>{{subItem.title}}</span>-->
      <!--</template>-->
      <aside-menu-item :sub-index="subIndex" :menu-data="subItem.menuData"></aside-menu-item>
    <!--</el-sub-menu>-->
  </div>
</template>

<script>
  import AsideMenuItem from './AsideMenuItem'
  export default {
    name: "AsideMenu",
    props: {
      subItem: {
        type: Object,
        default() {
          return {
            title: '人事信息管理',
            menuData: [
              {name: '员工列表', path: '/employee'},
              {name: '入离职管理', path: '/management'},
              {name: '部门管理', path: '/department'},
              {name: '员工调动', path: '/transfer'}
            ]
          };
        }
      },
      subIndex: {
        type: Number,
        default(){
          return 1;
        }
      }
    },
    components: {
      AsideMenuItem
    }
  }

</script>

<style scoped>
  .aside-menu {
    height: calc(100vh - 60px);
    background-color: #fff;
  }

</style>